<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ page session="false" %>
<html>
<head>
	<title>Home</title>
<style type="text/css">
 *{margin:0px; padding:0px;}
 #circle_wrapper{
   padding:10px;
   background-color:Black;
   overflow: hidden;
 }
 .circle{
  margin:5px;
  width: 50px; height:50px;
  border-radius:25px;
  background-color: white;
  float:left;
 }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="resources/js/jquery-1.3.2.min.js"></script>
<script src="resources/js/jquery.approach.js"></script>
<script type="text/javascript">
 $(document).ready(function (){
  console.log("ready");
  $(".circle").approach({
   opacity :0.2
  },200);
 });
</script>
	<!-- Latest compiled and minified CSS --> 
	<link rel= "stylesheet" href= "//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" >  
	<link rel= "stylesheet" href= "//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css" > 
	<script src= "//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js" ></script> 
</head>
<body>
페이지이동
<div id="circle_wrapper">
  <div class="circle"></div>
  <div class="circle"></div>
  <div class="circle"></div>
  <div class="circle"></div>
  <div class="circle"></div>
 </div>
</body>
</html>
</body>
</html>
